{include file="public/header" /}
<style>
    .my-upload-right{
        width: 25%;
        position: absolute;
        right: 23px;
        top: 10px;
    }
    .layui-form-item.my-width{
        width: 73%;
    }
    #uoload-thumbnail.layui-btn{
        display: none;
    }
    .layui-upload-list {
        width: 100%;
        height: 143px;
    }
    .layui-upload-list-title {
        height: 143px;
        line-height: 143px;
    }
    .xm-select-parent .xm-form-select dl,.layui-form-select dl {
        z-index: 99999999999;
    }
</style>
</head>
<body>
<form class="layui-form layui-form-pane" action="" style="padding: 20px;position: relative;">
    <input type="hidden" name="case_id" value="{$dataInfo.case_id|default=0}">
    {notempty name="SUBSTATIONS"}
    <input type="hidden" name="substation_id" value="{$dataInfo.substation_id|default=$SUBSTATIONS}">
    {/notempty}
    <div class="layui-form-item my-width">
        <label class="layui-form-label">案例标题</label>
        <div class="layui-input-block my-width">
            <input type="text" name="title" required lay-verify="required"  placeholder="请输入案例标题" autocomplete="off" class="layui-input" value="{$dataInfo.title|default=''}">
        </div>
    </div>
    <div class="layui-form-item my-width">
        <label class="layui-form-label">案例分类</label>
        <div class="layui-input-block my-width">
            <select name="classification_id" lay-search required lay-verify="required" >
                <option value="">请选择</option>
                {notempty name="classificationList"}
                {volist name="classificationList" id="tl"}
                <option value="{$tl.classification_id}" {present name="dataInfo.classification_id"}{if condition="$tl['classification_id'] == $dataInfo['classification_id']"}selected{/if}{/present}>{notempty name="$tl.level_name"}{$tl.level_name}&ensp;{/notempty}{$tl.classification_name}</option>
                {/volist}
                {/notempty}
            </select>
        </div>
    </div>
    <div class="layui-form-item my-width" pane>
        <label class="layui-form-label">案例置顶</label>
        <div class="layui-input-block">
            {notempty name="RadioIs"}
            {volist name="RadioIs" id="vo"}
            <input type="radio" name="is_top" value="{$key}" title="{$vo}" {present name="dataInfo.is_top"}{eq name="dataInfo.is_top" value="$key"}checked{/eq}{else/}{eq name="key" value="0"}checked{/eq}{/present}>
            {/volist}
            {/notempty}
        </div>
    </div>
    <div class="layui-form-item my-width" pane>
        <label class="layui-form-label">是否显示</label>
        <div class="layui-input-block">
            {notempty name="RadioIs"}
            {volist name="RadioIs" id="vo"}
            <input type="radio" name="is_display" value="{$key}" title="{$vo}" {present name="dataInfo.is_display"}{eq name="dataInfo.is_display" value="$key"}checked{/eq}{else/}{eq name="key" value="0"}checked{/eq}{/present}>
            {/volist}
            {/notempty}
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label ">关联图纸</label>
        <div class="layui-input-inline" style="width: 50%">
            <input type="text" id="drawing_id_text"  autocomplete="off" class="layui-input" value="{$dataInfo.drawing_text|default=''}" placeholder="请选择图纸" readonly >
            <input type="hidden" name="drawing_id"  autocomplete="off" class="layui-input" value="{$dataInfo.drawing_id|default=''}" placeholder="请选择图纸">
        </div>
        <button class="layui-btn" type="button" id="get_drawing">选择图纸</button>
    </div>
    <div class="layui-form-item">
        <div class="layui-upload">
            <button type="button" class="layui-btn" id="uoload-atlas">上传图集</button>
            <blockquote class="layui-elem-quote layui-quote-nm uoload-list-this" id="demo-uoload-atlas" {empty name="dataInfo.atlas"}style="display: none;"{/empty}>
            {notempty name="dataInfo.atlas"}
            {volist name="dataInfo.atlas" id="vo"}
            <div class="uoload-list-this-item">
                <a class="layui-btn layui-btn-danger layui-btn-xs"><i class="layui-icon">&#xe640;</i>删除&ensp;</a>
                <img src="{$vo.url}" class="layui-upload-img-this">
                <input type="text" name="atlas[{$key}][name]"  value="{$vo.name}">
                <input type="hidden" name="atlas[{$key}][url]"  value="{$vo.url}">
            </div>
            {/volist}
            {/notempty}
            </blockquote>
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">SEO关键字</label>
        <div class="layui-input-block" >
            <textarea name="seo_keyword" placeholder="请输入SEO关键字" class="layui-textarea">{$dataInfo.seo_keyword|default=''}</textarea>
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">SEO描叙</label>
        <div class="layui-input-block">
            <textarea name="seo_description" placeholder="请输入SEO描叙" class="layui-textarea">{$dataInfo.seo_description|default=''}</textarea>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">地址</label>
        <div class="layui-input-inline">
            <select name="sheng" lay-search=""  lay-filter="sheng" id="sheng" >
                <option value="">请选择</option>
            </select>
        </div>
        <div class="layui-input-inline">
            <select name="shi" lay-search="" lay-filter="shi" id="shi">
                <option value="">请选择</option>
            </select>
        </div>
        <div class="layui-input-inline">
            <select name="xian" lay-search="" lay-filter="xian" id="xian">
                <option value="">请选择</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">正文内容</label>
        <div class="layui-input-block">
            <textarea name="text_content" id="text_content" placeholder="请输入正文内容">{$dataInfo.text_content|default=''}</textarea>
        </div>
    </div>
    <div class="layui-form-item my-upload-right">
        <div class="layui-upload">
            <button type="button" class="layui-btn" id="uoload-thumbnail">上传缩略图</button>
            <input type="hidden" name="thumbnail" id="thumbnail" value="{$dataInfo.thumbnail|default=''}">
            <div class="layui-upload-list">
                <div class="layui-upload-list-title">缩略图</div>
                <img class="layui-upload-img" id="thumbnail-img" src="{$dataInfo.thumbnail|default=''}">
            </div>
        </div>
    </div>
    {empty name="SUBSTATIONS"}
    <div id="substation_type">
        <div class="layui-form-item" pane>
            <label class="layui-form-label">发布网站</label>
            <div class="layui-input-block">
                {notempty name="userSubstationList"}
                {volist name="userSubstationList" id="vo"}
                <input type="radio" name="substation_id" value="{$vo.substation_id}" title="{$vo.substation_name}"  {notempty name="dataInfo.substation_id"}{if condition="$dataInfo['substation_id'] eq $vo['substation_id']"}checked{/if}{/notempty}>
                {/volist}
                {/notempty}
            </div>
        </div>
    </div>
    {/empty}
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" type="button" lay-submit lay-filter="formDemo">立即提交</button>
        </div>
    </div>
</form>
</body>
<script>
    var sheng = "{$dataInfo.sheng|default=''}";
    var shi = "{$dataInfo.shi|default=''}";
    var xian = "{$dataInfo.xian|default=''}";
    var UploadIndex,form;
    layui.use(['form','upload','element'], function(){
        form = layui.form;
        var upload = layui.upload;
        form.render();
        //监听提交
        form.on('submit(formDemo)', function(data){
            post_sub("{:url('Cases/caseAdd')}",data.field);
            return false;
        });

        address_post_sub("{:url('Other/addressList')}",{pid:0},$('#sheng'),form,sheng);
        if(shi != '' && sheng != ''){
            address_post_sub("{:url('Other/addressList')}",{pid:sheng},$('#shi'),form,shi);
        }
        if(xian != '' && shi != '' && sheng != ''){
            address_post_sub("{:url('Other/addressList')}",{pid:shi},$('#xian'),form,xian);
        }
        form.on('select(sheng)', function(data){
            address_post_sub("{:url('Other/addressList')}",{pid:data.value},$('#shi'),form);
            $('#rec_address').val($('#sheng').find("option:selected").text());
            $('#xian').html("<option>请选择</option>");
        });
        form.on('select(shi)', function(data){
            address_post_sub("{:url('Other/addressList')}",{pid:data.value},$('#xian'),form);
            $('#rec_address').val($('#sheng').find("option:selected").text() + $('#shi').find("option:selected").text());
        });
        form.on('select(xian)', function(data){
            $('#rec_address').val($('#sheng').find("option:selected").text() + $('#shi').find("option:selected").text() + $('#xian').find("option:selected").text());
        });

        //缩略图上传
        var uploadInst = upload.render({
            elem: '#uoload-thumbnail'
            ,url: "{:url('Cases/uploadCasesAtlas',['type'=>'CaseThumbnail'])}"
            ,data: {
                drawing_id: function(){
                    return $('input[name=drawing_id]').val();
                }
            }
            ,before: function(obj){
                UploadIndex = layer.msg('图片上传中', {
                    icon: 16
                    ,shade: 0.01
                    ,time:0
                });
            }
            ,done: function(res){
                layer.close(UploadIndex);
                layer.msg(res.msg);
                //如果上传失败
                if(parseInt(res.code) == 0){
                    //上传成功-默认赋值
                    $("#thumbnail").val(res.url);
                    $("#thumbnail-img").attr("src",res.url);
                }
            }
        });

        //图纸图集上传
        upload.render({
            elem: '#uoload-atlas'
            ,url: "{:url('Cases/uploadCasesAtlas',['type'=>'CaseAtlas'])}"
            ,multiple:true
            ,data: {
                drawing_id: function(){
                    return $('input[name=drawing_id]').val();
                }
            }
            ,before: function(obj){
                count = 0;
                uploadImgMsg = "";
                UploadIndex = layer.msg('图片上传中', {
                    icon: 16
                    ,shade: 0.01
                    ,time:0
                });
            }
            ,allDone: function(obj){ //当文件全部被提交后，才触发
                layer.close(UploadIndex);
                if(count > 0) {
                    layer.msg("上传成功" + count + "个图片");
                }else{
                    layer.msg(uploadImgMsg);
                }
            }
            ,done: function(res){
                //如果上传失败
                if(parseInt(res.code) == 0){
                    count++;
                    var myIndex = $("#demo-uoload-atlas").find(".uoload-list-this-item").length;
                    //上传成功-默认赋值
                    $("#demo-uoload-atlas").css("display","block");
                    $("#demo-uoload-atlas").append('' +
                        '<div class="uoload-list-this-item">' +
                        '    <a class="layui-btn layui-btn-danger layui-btn-xs"><i class="layui-icon">&#xe640;</i>删除&ensp;</a>' +
                        '    <img src="'+res.url+'" class="layui-upload-img-this">' +
                        '    <input type="text" name="atlas['+myIndex+'][name]"  value="">' +
                        '    <input type="hidden" name="atlas['+myIndex+'][url]"  value="'+res.url+'">' +
                        '</div>');
                    del_atlas_del($("#demo-uoload-atlas").find(".uoload-list-this-item:last"));//设置删除事件
                }else{
                    uploadImgMsg = res.msg;
                }
            }
        });
    });

    $(function () {
        //百度编辑器初始化
        UE.getEditor('text_content',{
            initialFrameWidth:'100%',
            initialFrameHeight: 500,
        });
        $(".layui-upload .layui-upload-list").click(function () {
            $('#uoload-thumbnail').trigger('click');
        });
        //绑定删除图集事件
        $(".uoload-list-this-item").each(function () {
            del_atlas_del($(this));
        });
        //获取图纸
        $("#get_drawing").click(function () {
            var openIndex = layer.open({
                type: 2,
                title:"选择图纸",
                area: ["100%", "100%"],
                skin: 'layui-layer-rim',
                scrollbar: false,
                content: "{:url('Cases/choiceDrawing')}",
            });
        });
    });

    //删除图集事件
    function del_atlas_del(item) {
        item.find(".layui-btn-xs").click(function () {
            if(item.parent(".uoload-list-this").find(".uoload-list-this-item").length <= 1) {
                item.parent(".uoload-list-this").css("display","none");
            }
            item.remove();
        });
    }
</script>
</html>